<template>
  <div class="hos_page">
    <user-card :islogin="true" :isbind="true" style="margin-bottom: 0.8125rem"></user-card>
    <template v-if="noData">
      <div class="noresult">
        <img src="@/assets/img/img_no results@2x.png" alt="" />
        <div>无数据</div>
      </div>
    </template>
    <template v-else>
      <div class="bill_box">
        <div class="item" v-for="(item, index) in inpList" @click="goDetail(item)">
          <img src="@/assets/img/right.png" alt="" class="bill_box_img">
          <div class="item_cell">
            <div>就诊科室：</div>
            <div>{{ item.patientDept }}</div>
          </div>
          <div class="item_cell">
            <div>就诊医生：</div>
            <div>{{ item.patientDoctor }}</div>
          </div>

          <div class="item_cell">
            <div>总 费 用 ：</div>
            <div>¥{{ item.patienttotCost }}</div>
          </div>
          <div class="item_cell">
            <div>统筹费用：</div>
            <div>¥{{ item.patientpubCost }}</div>
          </div>
          <div class="item_cell">
            <div>自费费用：</div>
            <div style="color:red">¥{{ item.patientownCost }}</div>
          </div>
          <div class="item_cell">
            <div>卡支付费用：</div>
            <div style="color:red">¥{{ item.patientpayCost }}</div>
          </div>
          <div class="item_cell">
            <div>入院时间：</div>
            <div>{{ item.patientinDate }}</div>
          </div>
          <div class="item_cell">
            <div>出院时间：</div>
            <div>{{ item.patientoutDate ? item.patientoutDate : "未出院" }}</div>
          </div>

        </div>

      </div>
    </template>
  </div>
</template>
<script>
import userCard from "@/components/userCard.vue";

import { getInpatientInMainInfo } from "@/api/api";
export default {
  components: {
    userCard,
  },
  data() {
    return {
      noData: true,
      inpList: [],
    };
  },
  created() {
    if (window.localStorage.getItem("userInfo")) {
      this.userInfo = JSON.parse(window.localStorage.getItem("userInfo"));
    } else {
      this.userInfo = JSON.parse(
        window.localStorage.getItem("defaultUserInfo")
      );
    }
    this.GetInptList();
  },
  methods: {
    // 获取患者住院列表
    GetInptList() {
      var data = {
        hosId: "",
        operIdcardNo: this.userInfo.idNo,

      };
      getInpatientInMainInfo(data).then((res) => {
        if (res.code == 200) {
          if (Object.prototype.toString.call(res.data.patientInfo) === "[object Array]") {
            console.log('value是数组');
            this.inpList = res.data.patientInfo;
            this.inpList.reverse();
          } else {
            this.inpList.push(res.data.patientInfo);
          }

          if (this.inpList.length > 0) {
            this.noData = false;
          }
        }
      });
    },
    goDetail(item) {
      this.$router.push({
        path: "/accepting_gold_detail",
        query: {
          inpatientSerialNo: item.patientCode
        }
      })
    },
  },
  destroyed() { },
};
</script>
<style scoped>
.hos_page {
  height: 100vh;
  overflow: hidden;
}

.bill_box {
  width: 100%;
  height: calc(100vh - 6rem);
  overflow-y: auto;
  padding-bottom: 2rem;
}

.bill_box .item {
  width: calc(100% - 2rem);
  margin: 0 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid #e7ecf5;
  position: relative;
}

.bill_box .item:last-of-type {
  border: none;
}

.bill_box .item .item_cell {
  display: flex;
  align-items: center;
}

.bill_box .item .item_cell>div:nth-of-type(1) {
  width: 8rem;
  color: #a4adbe;
  line-height: 1.875rem;
}

.bill_box .item .item_cell>div:nth-of-type(2) {
  width: calc(100% - 5rem);
  line-height: 1.875rem;
}

.bill_box_img {
  width: 0.5rem;
  height: 0.8125rem;
  position: absolute;
  top: calc((100% - 0.8125rem) / 2);
  right: 1rem;
}

.noresult {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  height: 31.25rem;
}

.noresult img {
  display: block;
  width: 12.5rem;
  height: 9.75rem;
}
</style>
